<ul class="addr-list clearfix js_addressUl">
  {foreach $list as $k=>$v}
  {if $v.is_default}<input type="hidden" value="{$v.id}" class="js_sendAddress">{/if}
  <li class="js_addressLi {if $v.is_default}curr{/if}" id-data="{$v.id}">
    <div class="top clearfix">
      <h4 class="name left">收货人：{$v.receivers}</h4>
      <span class="tel right">{$v.phone}</span>
    </div>
    <div class="txt">收货地址：{$v.province}{$v.city}{$v.district}{$v.address}</div>
    <div class="tips1 js_addressDefault">{if $v.is_default}<a href="javascript:void(0);">默认</a>{/if}</div>
  </li>
  {foreachelse}
  <input type="hidden" value="" class="js_sendAddress">
  {/foreach}
</ul>
<div class="addr-form">
  <form>
    <div class="item clearfix">
      <label class="left">收货地址：</label>
      <select class="left" name="prov" id="prov" style="width:auto;">
        <option value="请选择..."></option>
      </select>
      <select class="left" name="city" id="city" style="width:auto;">
        <option value="请选择..."></option>
      </select>
      <select class="left" name="dist" id="dist" style="width:auto;">
        <option value="请选择..."></option>
      </select>
      <input type="hidden" value="" class="js_addressId" />
      <input type="hidden" value="" ctag="prov" id="pre_province"/>
      <input type="hidden" value="" ctag="city" id="pre_city"/>
      <input type="hidden" value="" ctag="dist" id="pre_district"/>
      <input type="hidden" value="0" class="js_isEdit">
      <input type="hidden" id="pre_post" is-use="1"/>
      <input type="hidden" id="pre_code"/>
    </div>
    <div class="item clearfix">
      <label class="left">详细地址：</label>
      <input type="text" class="input1 left js_address" />
    </div>
    <div class="item clearfix">
      <label class="left">收&nbsp;&nbsp;货&nbsp;&nbsp;人：</label>
      <input type="text" class="input1 input2 left js_receivers" />
    </div>
    <div class="item clearfix">
      <label class="left">手机号码：</label>
      <input type="text" class="input1 input2 left js_addressPhone" />
    </div>
    <button type="submit" class="addr-submit js_addressSubmit">保存收货地址</button>
  </form>
</div>
{load_js file='address/address_area.js'}
{load_js file='address/address_code.js'}
<script>
$(function(){
  citySelector.Init();
  // 新建地址
  var oldInfo = '';
  $('.js_address,.js_receivers,.js_addressPhone').focus(function(){
    oldInfo = $(this).val();
  });
  $('.js_address,.js_receivers,.js_addressPhone').blur(function(){
    var currInfo = $(this).val();
    if (currInfo != oldInfo) {
      $('.js_isEdit').val(1);
    }
    oldInfo = currInfo;
  });
  $('.js_addressSubmit').click(function(e){
    e.preventDefault();
    var addressId = $('.js_addressId').val();
    var province  = $('#pre_province').val();
    var city      = $('#pre_city').val();
    var district  = $('#pre_district').val();
    var address   = $('.js_address').val();
    var receivers = $('.js_receivers').val();
    var phone     = $('.js_addressPhone').val();
    var code      = $('#pre_post').val(); // 邮编
    if (!province) {
      showMsg('请选择省份');
      return;
    }
    if (!city) {
      showMsg('请选择城市');
      return;
    }
    if (!district) {
      showMsg('请选择区县');
      return;
    }
    if (!address) {
      showMsg('请填写详细地址');
      return;
    }
    if (!receivers) {
      showMsg('请填写收货人');
      return;
    }
    if (!phone) {
      showMsg('填写收货人手机号码');
      return;
    }
    $.post("{AnUrl('address/save_address')}", { 
      id       :addressId,
      province :province,
      city     :city,
      district :district,
      address  :address,
      receivers:receivers,
      phone    :phone,
      code     :code,
    }, function(data){
      if (data.info == 'ok') {
        $('.js_addressLi').removeClass('curr');
        $('.js_addressDefault').html('');
        if (addressId) {
          var addressLi = $('.js_addressLi[id-data='+addressId+']');
          addressLi.find('h4').html('收货人：'+receivers);
          addressLi.find('span').html(phone);
          addressLi.children().eq(1).html('收货地址：' + province + city + district + address);
          addressLi.children().eq(2).html('<a href="javascript:void(0);">默认</a>');
          $('.js_sendAddress').val(addressId);
        } else {
          $('.js_addressUl').append('<li class="js_addressLi urr" id-data="'+ data.id +'">\
              <div class="top clearfix">\
                <h4 class="name left">收货人：'+ receivers +'</h4>\
                <span class="tel right">'+ phone +'</span>\
              </div>\
              <div class="txt">收货地址：'+ province+city+district+address +'</div>\
              <div class="tips1 js_addressDefault"><a href="javascript:void(0);">默认</a></div>\
            </li>');
          $('.js_sendAddress').val(data.id);
        }

        // 恢复初始状态
        $('.js_addressId').val('');
        $('#pre_province').val('');
        $('#pre_city').val('');
        $('#pre_district').val('');
        citySelector.Init(false);
        $('.js_address').val('');
        $('.js_receivers').val('');
        $('.js_addressPhone').val('');
        $('.js_isEdit').val(0);
      } else {
        showMsg(data.info);
      }
    }, 'json');
  });
  
  // 编辑地址
  $('.js_addressUl').on('click', '.js_addressLi', function(){
    var currLi    = $(this);
    var address   = $('.js_address').val();
    var receivers = $('.js_receivers').val();
    var phone     = $('.js_addressPhone').val();
    var isEdit    = $('.js_isEdit').val();
    if (isEdit == 1 && (address || receivers || phone)) {
      showConfirm('有地址信息处于编辑中，是否不保存直接编辑现有地址！', 0, function(){
        currLi.siblings().removeClass('curr');
        currLi.addClass('curr');
        
        var addressId = currLi.attr('id-data');
        // 设置为默认
        $.post("{AnUrl('address/set_default_address')}", { id:addressId }, function(data){
          if (data.info == 'ok') {
            $('.js_addressDefault').html('');
            currLi.children().eq(2).html('<a href="javascript:void(0);">默认</a>');
          }
        }, 'json');
        // 获取地址信息
        $.post("{AnUrl('address/get_address')}", { id:addressId }, function(data){
          if (data.info == 'ok') {
            $('.js_addressId').val(data.address.id);
            $('#pre_province').val(data.address.province);
            $('#pre_city').val(data.address.city);
            $('#pre_district').val(data.address.district);
            citySelector.Init(false);
            $('.js_address').val(data.address.address);
            $('.js_receivers').val(data.address.receivers);
            $('.js_addressPhone').val(data.address.phone);
            $('.js_isEdit').val(0);
            $('.js_sendAddress').val(data.address.id);
          } else {
            showMsg(data.info);
          }
        }, 'json');
      });
    } else {
      $(this).siblings().removeClass('curr');
      $(this).addClass('curr');
      
      var addressId = $(this).attr('id-data');
      // 设置为默认
      $.post("{AnUrl('address/set_default_address')}", { id:addressId }, function(data){
        if (data.info == 'ok') {
          $('.js_addressDefault').html('');
          currLi.children().eq(2).html('<a href="javascript:void(0);">默认</a>');
        }
      }, 'json');
      // 获取地址信息
      $.post("{AnUrl('address/get_address')}", { id:addressId }, function(data){
        if (data.info == 'ok') {
          $('.js_addressId').val(data.address.id);
          $('#pre_province').val(data.address.province);
          $('#pre_city').val(data.address.city);
          $('#pre_district').val(data.address.district);
          citySelector.Init();
          $('.js_address').val(data.address.address);
          $('.js_receivers').val(data.address.receivers);
          $('.js_addressPhone').val(data.address.phone);
          $('.js_isEdit').val(0);
          $('.js_sendAddress').val(data.address.id);
        } else {
          showMsg(data.info);
        }
      }, 'json');
    };
  });
});
</script>